<template>
  <div>
    <!-- Card -->
    <div class="card card-hover-shadow h-100" href="#">
      <div class="card-body">
        <h1 class="card-title">大白菜</h1>
        <hr />

        <div class="row align-items-center gx-2 mb-1">
          <div class="col-6">
            <span class="h5 text-secondary">全国均价</span><br />
          </div>
          <div class="col-6"><h4>2021/8/19</h4></div>
        </div>
        <br />
        <!-- End Row -->

        <div class="row align-items-center gx-2 mb-3">
          <div class="col-6"><span class="h3">0.6</span><br /></div>

          <div class="col-6">
            <h5 class="text-warning">最高报价：黑龙江1.5</h5>
          </div>
        </div>
        <br />

        <div class="row align-items-center gx-2 mb-3">
          <div class="col-6"><span class="h5">单位：元/斤</span></div>

          <div class="col-6">
            <h5 class="text-primary">最低报价：云南0.3</h5>
          </div>
        </div>
        <br />
        <span class="font-size-sm">相比昨日</span>
        <span class="badge badge-soft-danger"> 上升12.5% </span>
      </div>
    </div>

    <!-- End Card -->
  </div>
</template>

<script>
export default {
  data() {
    return {};
  },
};
</script>

<style scoped>
@import url("../../../static/css/theme-min.css");
</style>
